import React, {
    PureComponent
} from "react";import { StyleSheet, Dimensions, View ,Image,TouchableOpacity,Text,SafeAreaView} from 'react-native';

import Pdf from 'react-native-pdf';

export default class PDFLook extends PureComponent {
    static navigationOptions = ({
                                    navigation
                                }: any) => ({
        headerTintColor:'#333333',
        headerStyle:{backgroundColor:'white'},
        title: navigation.state.params.name,
        headerLeft: <TouchableOpacity onPress={()=>{
            navigation.goBack()
        }}>
            <Image style={{marginLeft:12}} source={require('../../../res/img/gobal_back.png')}/>
        </TouchableOpacity>,
        headerRight:<Text/>
    })
    render() {

        const {
            path
        } = this.props.navigation.state.params

        const source = {uri:path,cache:true};
        //const source = require('./test.pdf');  // ios only
        //const source = {uri:'bundle-assets://test.pdf'};

        //const source = {uri:'file:///sdcard/test.pdf'};
        //const source = {uri:"data:application/pdf;base64,..."};

        return (
            <SafeAreaView style={styles.container}>
                <Pdf
                    source={source}
                    onLoadComplete={(numberOfPages,filePath)=>{
                        console.log(`number of pages: ${numberOfPages}`);
                    }}
                    onPageChanged={(page,numberOfPages)=>{
                        console.log(`current page: ${page}`);
                    }}
                    onError={(error)=>{
                        console.log(error);
                    }}
                    style={styles.pdf}/>
            </SafeAreaView>
        )
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        justifyContent: 'flex-start',
        alignItems: 'center',
        // marginTop: 25,
    },
    pdf: {
        flex:1,
        width:Dimensions.get('window').width,
    }
});